.login_page_wrap {
  width: 100vw;
  height: 100vh;
  background: url(./image/bg.png) no-repeat;
  background-size: 100% 100%;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  -khtml-user-select: none;
  user-select: none;

  .center_card_box {
    width: 1220px;
    height: 680px;
    border-radius: 20px;
    background: url(./image/center_card_bg.svg);
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.92);
    display: flex;
    flex-direction: row;
    overflow: hidden;

    .left_box {
      width: 50%;
      height: 100%;
      position: relative;

      /* 插画 */
      .inbetweening_1 {
        position: absolute;
        top: 48px;
        left: 104px;
      }
      .inbetweening_2 {
        position: absolute;
        top: 176px;
        left: 195px;
      }
      .inbetweening_3 {
        position: absolute;
        top: 560px;
        left: 104px;
      }
      .inbetweening_4 {
        position: absolute;
        top: 430px;
        left: 248px;
        transform: scale(0.8);
      }
    }
    .right_box {
      width: 50%;
      height: 100%;
      background: #ffffff;
      position: relative;

      .qrcode_corner_mark_img {
        position: absolute;
        top: 0;
        right: 0;
        cursor: pointer;
        transition: 0.2s;
      }

      .qrcode_corner_mark_img:hover {
        transform: scale(1.06);
        top: 3px;
        right: 3px;
      }

      .qrcode_corner_mark_box {
        position: absolute;
        top: 34px;
        right: 4px;
        width: 112px;
        height: 30px;
        background-color: transparent;
        transform: rotate(42deg);
      }

      /* 欢迎语 */
      .welcome_speech_text {
        letter-spacing: 3px;
        font-size: 34px;
        font-family: PingFangSC-R;
        font-weight: bold;
        position: absolute;
        top: 128px;
        left: 50%;
        transform: translate(-49.6%);
      }

      /* 登录表单模块 */
      .login_form_box {
        // border: 1px solid red;
        width: 64%;
        position: absolute;
        top: 268px;
        left: 50%;
        transform: translate(-50%);

        .user_name_form_item {
          height: 60px;
          position: relative;

          .ant-input-affix-wrapper-focused {
            .fx_icon {
              color: rgb(75, 148, 250);
              font-size: 22px;
              position: absolute;
              top: 50%;
              left: 14px;
              transform: translateY(-50%);
              z-index: 2;
            }
          }

          .ant-input-status-error {
            .fx_icon {
              color: rgb(250, 88, 91);
              font-size: 22px;
              position: absolute;
              top: 50%;
              left: 14px;
              transform: translateY(-50%);
              z-index: 2;
            }
          }

          .fx_icon {
            color: rgb(122, 122, 122);
            font-size: 22px;
            position: absolute;
            top: 50%;
            left: 14px;
            transform: translateY(-50%);
            z-index: 2;
          }

          .ant-input {
            height: 32px;
            padding-left: 32px;
            font-size: 16px;
            letter-spacing: 1px;
          }
        }

        .password_form_item {
          margin-top: 30px;
          height: 60px;
          position: relative;

          .ant-input-affix-wrapper-focused {
            .fx_icon {
              color: rgb(75, 148, 250);
              font-size: 22px;
              position: absolute;
              top: 50%;
              left: 14px;
              transform: translateY(-50%);
              z-index: 2;
            }
          }

          .ant-input-status-error {
            .fx_icon {
              color: rgb(250, 88, 91);
              font-size: 22px;
              position: absolute;
              top: 50%;
              left: 14px;
              transform: translateY(-50%);
              z-index: 2;
            }
          }

          .fx_icon {
            color: rgb(122, 122, 122);
            font-size: 22px;
            position: absolute;
            top: 50%;
            left: 14px;
            transform: translateY(-50%);
            z-index: 2;
          }

          .ant-input {
            padding-left: 32px;
            height: 32px;
            font-size: 16px;
            letter-spacing: 1px;
          }
        }

        .login_btn {
          margin-top: 80px;
          width: 100%;
          height: 50px;
          font-size: 22px;
          letter-spacing: 12px;
          // font-weight: bold;
          font-family: PingFangSC-R;
          position: relative;
          left: 50%;
          transform: translateX(-50%);
        }

        .click_vf_btn {
          margin-top: 10px;
          font-size: 16px;
          width: 100%;
          height: 45px;
          letter-spacing: 8px;

          .click_vf_btn_text {
            margin-left: 8px;
          }
        }

        .tg_vf_btn {
          margin-top: 10px;
          font-size: 16px;
          width: 100%;
          height: 45px;
          letter-spacing: 8px;
          background-color: #67c23a;
          border: none;

          div {
            display: none !important;
          }

          .click_vf_btn_text {
            margin-left: 8px;
            color: #ffffff;
          }
        }
      }
    }
  }
}

/* 滑块验证码弹窗 */
.slider_verif_code_modal {
  width: 360px !important;
  .ant-modal-content {
    width: 360px;
    .ant-modal-body {
      padding: 10px 0px;
    }
  }
}

/* 自适应插件背景 */
.react-screen-box {
  background: url(./image/bg.png) no-repeat !important;
  background-size: 100% 100% !important;
}
